<link rel="stylesheet" href="/assets/store/plugins/kindeditor/themes/default/default.css">
<script src="/assets/colpick.js" type="text/javascript"></script>
<link rel="stylesheet" href="/assets/colpick.css" type="text/css"/>

<div class="row-content am-cf">
    <div class="row">
        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">
            <div class="widget am-cf">
                <form id="my-form" class="am-form tpl-form-line-form" method="post">
                    <input type="hidden" name="ads[sitep]" value="<?php echo $sitep; ?>" />
                    <input type="hidden" name="ads[sites]" value="<?php echo $sites; ?>" />

                    <input type="hidden" name="ads[id]" value="<?php echo $ads['id']; ?>" />
                    <div class="widget-body">
                        <fieldset>
                            <div class="widget-head am-cf">
                                <div class="widget-title am-fl">广告管理-编辑</div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-2 am-form-label form-require">名称/内容 </label>
                                <div class="am-u-sm-10 am-u-end">
                                    <input type="text" class="tpl-form-input" name="ads[title]"
                                           value="<?php echo $ads['title']; ?>" required>
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label class="am-u-sm-2 am-form-label form-require">版位 </label>
                                <div class="am-u-sm-10 am-u-end">
                                    <label class="am-form-label" style="color:red;">
                                        <input type="hidden" name="ads[adsbw_id]" value="<?php echo $ads['adsbw_id']; ?>>" />
                                        <?php echo $site['bwtitle']; ?>
                                    </label>
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label class="am-u-sm-2 am-form-label form-require">类型 </label>
                                <div class="am-u-sm-10">
                                    <label class="am-radio-inline">
                                        <input type="radio" name="ads[types]" value="1" <?php if($ads['types']==1) echo "checked"; ?> data-am-ucheck="" class="am-ucheck-radio"><span class="am-ucheck-icons"><i class="am-icon-unchecked"></i><i class="am-icon-checked"></i></span>
                                        图片
                                    </label>
                                    <label class="am-radio-inline">
                                        <input type="radio" name="ads[types]" value="2" <?php if($ads['types']==2) echo "checked"; ?> data-am-ucheck="" class="am-ucheck-radio"><span class="am-ucheck-icons"><i class="am-icon-unchecked"></i><i class="am-icon-checked"></i></span>
                                        文字
                                    </label>
                                </div>
                            </div>

                            <div class="am-form-group pic-select">
                                <label class="am-u-sm-2 am-form-label form-require">图片 </label>
                                <div class="am-u-sm-10 am-u-end">
                                    <input type="hidden" id="image-url" name="ads[thumb]" value="<?php echo $ads['thumb']; ?>" required>
                                    <div class="am-form-file">
                                        <div class="am-form-file">
                                            <button type="button"
                                                    class="upload-file am-btn am-btn-secondary am-radius">
                                                <i class="am-icon-cloud-upload"></i> 选择图片
                                            </button>
                                            <div class="uploader-list am-cf">
                                                <?php if(!empty($ads['thumb'])): ?>
                                                    <div class="file-item"><img src="<?php echo $ads['thumb']; ?>" /></div>
                                                <?php endif; ?>
                                            </div>
                                        </div>
                                        <div class="help-block am-margin-top-sm">
                                            <small>大小10M以下</small>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="am-form-group ">
                                <label class="am-u-sm-2 am-form-label form-require">文字颜色 </label> 
                                <div class="am-u-sm-10">
                                    <input type="hidden" class="color-input" name="ads[color]" value="<?php echo isset($ads['color']) ? $ads['color'] : '0063DC'; ?>" />
                                    <div class="color-box" style="width:100px;height:30px;border:#ccc solid 1px;background-color:#<?php echo isset($ads['color']) ? $ads['color'] : '0063DC'; ?>;cursor:pointer;"></div>
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label class="am-u-sm-2 am-form-label form-require">宽/高 </label>
                                <div class="am-u-sm-10 am-u-end inline-wh">
                                    <input type="number" name="ads[width]" value="<?php echo $ads['width']; ?>" style="width:50px;display:inline-block;" />
                                    <input type="number"name="ads[height]" value="<?php echo $ads['height']; ?>" style="width:50px;display:inline-block;" />
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label class="am-u-sm-2 am-form-label form-require">URL链接 </label>
                                <div class="am-u-sm-10 am-u-end">
                                    <input type="text" class="tpl-form-input" name="ads[url]"
                                           value="<?php echo $ads['url']; ?>" required>
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label class="am-u-sm-2 am-u-lg-2 am-form-label form-require">排序 </label>
                                <div class="am-u-sm-10 am-u-end">
                                    <input type="number" class="tpl-form-input" name="ads[sorts]"
                                           value="<?php echo $ads['sorts']; ?>" required>
                                    <small>数字越小越靠前</small>
                                </div>
                            </div>


                            <div class="am-form-group">
                                <div class="am-u-sm-9 am-u-sm-push-3 am-margin-top-lg">
                                    <button type="submit" class="j-submit am-btn am-btn-secondary">提交
                                    </button>
                                </div>
                            </div>
                        </fieldset>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script src="/assets/store/plugins/kindeditor/kindeditor-min.js"></script>
<script src="/assets/store/plugins/kindeditor/lang/zh_CN.js"></script>
<script>
$(function () {
    IMG_EDITOR_CONFIG.uploadJson = '<?php echo url('editor/uploadn') ?>';
    var imgeditor = KindEditor.editor(IMG_EDITOR_CONFIG);//图片上传配置
    /**
        * 上传图片
        */
    $('.upload-file').click(function(){
        imgeditor.loadPlugin('image', function() {
            imgeditor.plugin.imageDialog({
                imageUrl : $('#image-url').val(),
                clickFn : function(url, title, width, height, border, align) {
                    url = url.indexOf('http')>-1 ? url : '<?php echo config('myconfig.host_url'); ?>' + url.slice(1);
                    $('#image-url').val(url);
                    $('.uploader-list').html('<div class="file-item"><img src="'+url+'" /></div>');
                    imgeditor.hideDialog();
                }
            });
        });
    });

    $('input[name="ads[types]"]').click(function(){
        var types = $(this).val();
        if(types ==1){
            $('.pic-select').show();
        }else{
            $('.pic-select').hide();
        }
    });
    $('#my-form').superForm();

    $('.color-box').colpick({
        colorScheme:'dark',
        layout:'rgbhex',
        color:'0063DC',
        onSubmit:function(hsb,hex,rgb,el) {
            $(el).css('background-color', '#'+hex);
            $(".color-input").val(hex);
            $(el).colpickHide();
        }
    }).css('background-color', '#<?php echo isset($ads['color']) ? $ads['color'] : '0063DC'; ?>');
});
</script>
